<template>
<div>
<el-row>

<el-form :inline="true" >
	<el-form-item >
		<daterange v-bind:se.sync="s_e" type="daterange"></daterange>
    </el-form-item>

	<el-form-item>
	    <el-button type="primary" @click="onSubmit" :loading="btnloading">查询</el-button>
	</el-form-item>

	<el-form-item>
	    <el-button type="success" @click="toExcel">导出Excel</el-button>
	</el-form-item>

</el-form>
</el-row>

<el-row>
<el-table
    :data="objs"
    border
    show-summary
    v-loading="loading"
    style="width: 100%">
    <el-table-column
      prop="name"
      label="产品名称"
      width="300"
      >
    </el-table-column>

    <el-table-column
      prop="attr_name"
      label="型号名称"
      width="300"
      >
    </el-table-column>

    <el-table-column
      prop="count"
      label="核销次数"
      width="120"
      sortable
      >
    </el-table-column>

    <el-table-column
      prop="des_num"
      label="核销数量"
      width="120"
      sortable
      >
    </el-table-column>

    <el-table-column
      prop=""
      label=""
      width=""
      >
    </el-table-column>

    
    
</el-table>
</el-row>

</div>
</template>

<script>

import { mapGetters } from 'vuex'
import { date2str, dateDiff } from '../../../config/util'
import daterange from '../../../components/daterange'

export default {
	
	name : 'cancellation',
	
	data () {
		return {
		  	s_e : [date2str(new Date()), date2str(new Date())],
		  	loading : false,
		  	filename : '',

		  	btnloading : false,
		}
	},

	props : {

	},

	components : {
		daterange,
	},

	computed : {
		...mapGetters([
			'cancellation',
		]),

		objs () {
			let statistics = {};
			let arr = [];
			const length = this.cancellation.length;
			for (let i = 0; i < length; i++){
				let tmp = this.cancellation[i];
				let key = tmp.sale_code + '-' + tmp.attr_id;
				if(statistics[key] == undefined){
					statistics[key] = {
                        'name' : tmp.title,
                        'sale_code' : tmp.sale_code,
                        'attr_id' : tmp.attr_id,
                        'attr_name' : tmp.attr_name,
                        'count' : 1,
                        'des_num' : parseInt(tmp.des_num),
                    };
				}else{
					statistics[key].count += 1;
                    statistics[key].des_num += parseInt(tmp.des_num);
				}
			}

            for (let key1 in statistics) {
				arr.push(statistics[key1]);
			}

            return arr;
		},
		
	},

	methods : {
		getData() {

			const day = dateDiff(this.s_e[0], this.s_e[1]);
			
			if(day > 30){
                this.$message.warning('时间跨度不能超过30天');
                return;
			}

			this.loading = true;
			this.btnloading = true;

			this.filename = '核销报表' + '[' + this.s_e[0] + '~' + this.s_e[1] + ']';

			let para = {
				fun : 'cancellation',
				start_time : this.s_e[0] + ' 00:00:00',
				end_time : this.s_e[1] + ' 23:59:59',
				cb : res => {
					this.loading = false;
					this.btnloading = false;
				},
				err : res => {
					this.loading = false;
					this.btnloading = false;
					this.$notify.error({
			          title: '错误',
			          message: res,
			        });
				}
			};
			this.$store.dispatch('query', para);
		},

		onSubmit () {
			this.getData();
		},

		toExcel (){
			
			var labels = ['title', 'attr_name', 'order_unique_code', 'hexiao_time', 'des_num', 
			'name', 'mobile', 'cardno', 'view_name', 'device', 'out_order_id'];
	        var arr = [];
	        for(var i = 0; i< this.cancellation.length; i++){
	            var tmp = this.cancellation[i];
	            var haha = [];
	            for(var j = 0; j < labels.length; j++){
	                haha.push(tmp[labels[j]]);
	            }
	            arr.push(haha);
	        }
	        arr.splice(0, 0, ['产品名称', '型号名称', '票码', '核销时间' , '核销数量', 
	        	'姓名', '电活', '身份证', '商家', '核销设备码' , '订单编号'
	        	]);

	        ExportUtil.toExcel(arr, this.filename);

		}
	},

	watch : {
	    
	},

	mounted () {
		this.getData();
	},

}
</script>

<style scoped>

</style>
